<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:include="include :: header"></head>
<style>
    /*重新设置样式*/
    .form-control {
        width: 196px !important;
        height: 34px !important;
        padding: 10px !important;
    }

    #recommendtable {
        box-sizing: border-box !important;
        width: 100% !important;
        margin-bottom: 1rem !important;
        color: #212529 !important;
        border-collapse: collapse !important;
        display: table !important;
        border-spacing: 2px !important;
        border-color: grey !important;
        text-align: left !important;
    }

    #recommendtable th {
        height: 50px;
    }

    #recommendtable tr {
        height: 35px;
        display: table-row;
        vertical-align: inherit;
        border-color: inherit;
        border-top-color: inherit;
        border-right-color: inherit;
        border-left-color: inherit;
        border-bottom: 2px #F3F1F1 solid;
    }

    #recommendtable td {
        font-size: 16px;
    }

    #recommendtable tr:nth-child(odd) {
        background: #FFFFFF !important;
    }

    #recommendtable tr:nth-child(even) {
        background: #FFFFFF !important;
    }

    .showinfo, .hideinfo {
        cursor: pointer;
        text-align: center;
    }

    /*.fixed-table-container .no-records-found>td:last-of-type{display:block !important;position:absolute;width:100%;}*/
    /*.fixed-table-container{height:auto !important;}*/
    /*p{margin-bottom:0;}*/
    /*table thead, tbody tr {*/
    /*display:table;*/
    /*width:100%;*/
    /*table-layout:fixed;*/
    /*}*/
    /*!**注释6.有事会错位，根据情况适当调整这里**!*/
    /*table thead {*/
    /*width: calc( 100% - 0.4em )*/
    /*}*/
</style>
<body class="hold-transition skin-blue sidebar-mini" onload="checkBrowser()">
<section class="content-header">
    <h1 style="display: inline-block">库存划项目库存导出</h1>
    <button onclick="javascript:location.href='/purchase/change/importPage'" type="button" class="btn btn-success"
            style="text-align:center;vertical-align:middle;font-size:30px;position:absolute;right:16%;display: inline-block;background-color: transparent;border: none;color: #5c5c5c;outline:none;">
        <i style="-moz-transform:scaleX(-1);-webkit-transform:scaleX(-1);-o-transform:scaleX(-1);transform:scaleX(-1);filter:FlipH;"
           class="glyphicon glyphicon-share-alt"></i><span
            style="margin-left: 5px;font-size: 16px;position: absolute;top: 20%;">返回批量库存划项目标记导入页面</span>
    </button>
</section>
<!--查看台账模态框-->
<div class="modal fade" id="modal-view">
    <div class="modal-dialog" style="width: 750px; height: 600px">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">台账信息</h4>
            </div>
            <div class="modal-body">
                <table id="bootstrap-table-view"></table>
                <div id="annex" class="row">
                    <div class="col-lg-12"
                         style="
                                border-bottom: 1px solid #cdcdcd;
                                color: #444;
                                padding: 0px">
                             <span
                                     style="
                                        text-transform: uppercase;
                                        font-weight: 600;
                                        line-height: 50px;
                                        border-bottom: 4px solid #1e88e5;
                                        display: inline-block;
                                        margin: 0 0 -1px;
                                        font: 400 16px/36px 'Open Sans Condensed',sans-serif;
                                        padding: 0 5px 0 0;
                                        outline: none;">附件列表
                             </span></div>
                    <table id="recommendtable">
                        <thead>
                        <tr>
                            <th>文件名</th>
                            <th style="width: 15%;text-align: center">文件大小</th>
                            <th style="width: 10%;text-align: center">下载次数</th>
                            <th style="width: 10%;text-align: center">操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td>
                                <small><p style="word-wrap: break-word;width: 100%"></p></small>
                            </td>
                            <td>
                                <small></small>
                            </td>
                            <td>
                                <small></small>
                            </td>
                            <td>
                                <small></small>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-success" data-dismiss="modal">确定</button>
            </div>
        </div>
    </div>
</div>
<!--查看库存划项目信息模态框-->
<div class="modal fade" id="modal-change-view">
    <div class="modal-dialog" style="width: 750px; height: 600px">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">库存划项目信息</h4>
            </div>
            <div class="modal-body">
                <table id="bootstrap-change-table-view"></table>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-success" data-dismiss="modal">确定</button>
            </div>
        </div>
    </div>
</div>
<section class="content">
    <div class="row">
        <div class="col-xs-12">
            <div class="box">
                <div class="box-header">
                    <form id="queryForm" action="/purchase/invPro/exportPurInvExcel">
                        <div class="row">
                            <div class="form-inline">
                                <div class="form-group" style="margin-right: 10px; margin-bottom: 5px">
                                    <label>项目编号</label>
                                    <input style="width: 123px" type="text" name="ityProCode" class="form-control"
                                           placeholder="请输入项目编号">
                                </div>
                                <div class="form-group" style="margin-right: 10px; margin-bottom: 5px">
                                    <label>项目名称</label>
                                    <input style="width: 123px" type="text" name="ityProName" class="form-control"
                                           placeholder="请输入项目名称">
                                </div>
                                <div class="form-group" style="margin-right: 10px; margin-bottom: 5px">
                                    <label>SAP物料编码</label>
                                    <input style="width: 210px" type="text" name="itySapCode" class="form-control"
                                           placeholder="请输入SAP物料编码">
                                </div>
                                <div class="form-group" style="margin-right: 10px; margin-bottom: 5px">
                                    <label>物料描述</label>
                                    <input style="width: 210px" type="text" name="ityMatDesc" class="form-control"
                                           placeholder="请输入物料描述">
                                </div>
                                <div class="form-group" style="margin-right: 10px; margin-bottom: 5px">
                                    <label>跟踪号</label>
                                    <input style="width: 108px" type="text" name="ityTrackCode" class="form-control"
                                           placeholder="请输入跟踪号">
                                </div>
                                <div class="form-group" style=" display: none; margin-right: 10px; margin-bottom: 5px">
                                    <label>在库类型</label>
                                    <select name="ityStockType" class="form-control"
                                            style="padding: 0px!important;text-align: center!important;text-align-last: center!important;width:80px!important;">
                                        <!--<option value="" selected="selected">请选择</option>-->
                                        <option value="1" selected="selected">库存在库</option>
                                        <!--<option value="2" selected="selected">项目在库</option>-->
                                    </select>
                                </div>
                                <div class="form-group" style="margin-right: 10px; margin-bottom: 5px">
                                    <label>仓库</label>
                                    <select id="ityWhiId" name="ityWhiId" class="form-control"
                                            style="padding: 0px!important;text-align: center!important;text-align-last: center!important;width: auto!important;">
                                    </select>
                                </div>
                                <div class="form-group" style="margin-right: 10px; margin-bottom: 5px">
                                    <label>生产状态</label>
                                    <select name="proStatus" class="form-control"
                                            style="padding: 0px!important;text-align: center!important;text-align-last: center!important;width:auto!important;">
                                        <option value="" selected="selected">全部</option>
                                        <option value="-1">无状态</option>
                                        <option value="1">未开始</option>
                                        <option value="2">执行中</option>
                                        <option value="3">已完成</option>
                                        <option value="4">取消</option>
                                        <option value="5">暂缓</option>
                                    </select>
                                </div>
                                <button type="button" class="btn btn-success" id="btn-search">
                                    <span class="Bold">搜索</span>
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="row" id="toolbar1">
                    <button type="button" id="btn_exportExcel" shiro:hasPermission="purinv:purchalist:edit"
                            class="btn btn-primary">
                        导出所有库存在库库存信息
                    </button>
                    <img th:src="@{/img/downloadding.gif}" id="btn_tips" style="display: none"/>
                </div>
                <div class="box-body">
                    <table id="bootstrap-table" style="table-layout: fixed;"></table>
                </div>
            </div>
        </div>
    </div>
</section>
<div th:include="include :: footer"></div>
<script th:inline="javascript">

    var anxTable;
    var table4;
    var table;


    function checkBrowserFun() {
        let is360 = false;
        let isIE = false;
        let isFirefox = false;
        let isChrome = false;
        let isEdge = false;
        let broName = 'Runing';
        let str = '';
        let strStart = 0;
        let strStop = 0;
        let arr = new Array();
        let temp = '';
        let userAgent = window.navigator.userAgent; //包含以下属性中所有或一部分的字符串：appCodeName,appName,appVersion,language,platform
        /*alert(userAgent);*/
        //FireFox
        if (userAgent.indexOf('Firefox') != -1) {
            isFireFox = true;
            /*broName = 'FireFox浏览器';*/
            strStart = userAgent.indexOf('Firefox');
            temp = userAgent.substring(strStart);
            broName = temp.replace('/', '版本号')

        }
        //Edge
        if (userAgent.indexOf('Edge') != -1) {
            isEdge = true;
            /*broName = 'Edge浏览器';*/
            strStart = userAgent.indexOf('Edge');
            temp = userAgent.substring(strStart);
            broName = temp.replace('/', '版本号');
        }
        //IE浏览器
        if (userAgent.indexOf('NET') != -1 && userAgent.indexOf("rv") != -1) {
            isIE = true;
            /*broName = 'IE浏览器'; */
            strStart = userAgent.indexOf('rv');
            strStop = userAgent.indexOf(')');
            temp = userAgent.substring(strStart, strStop);
            broName = temp.replace('rv', 'IE').replace(':', '版本号');
        }
        //360极速模式可以区分360安全浏览器和360极速浏览器
        if (userAgent.indexOf('WOW') != -1 && userAgent.indexOf("NET") < 0 && userAgent.indexOf("Firefox") < 0) {
            if (navigator.javaEnabled()) {
                is360 = true;
                broName = '360安全浏览器-极速模式';
            } else {
                is360 = true;
                broName = '360极速浏览器-极速模式';
            }
        }
        //360兼容
        if (userAgent.indexOf('WOW') != -1 && userAgent.indexOf("NET") != -1 && userAgent.indexOf("MSIE") != -1 && userAgent.indexOf("rv") < 0) {
            is360 = true;
            broName = '360兼容模式';
        }
        //Chrome浏览器
        if (userAgent.indexOf('WOW') < 0 && userAgent.indexOf('Chrome') > 0 && userAgent.indexOf("Edg") < 0) {
            isChrome = true;
            /*broName = 'Chrome浏览器';*/
            strStart = userAgent.indexOf('Chrome');
            strStop = userAgent.indexOf(' Safari');
            temp = userAgent.substring(strStart, strStop);
            broName = temp.replace('/', '版本号');
        }
        return isChrome;
    }

    /**
     * 检测浏览器
     * */
    function checkBrowser() {
        if (!checkBrowserFun()) {
            alert("尊敬的客户，您使用浏览器不是谷歌浏览器，请使用谷歌浏览器访问本系统！");
            location.href = ctx + "overview/index";
        }
    }

    /**
     * 加载仓库列表
     * */
    function loadWhList() {
        $.post(ctx + 'common/warehouseInfo/list',
            {}
            , function (result) {
                $('#ityWhiId').empty();
                $('#ityWhiId').append('<option value="" selected="selected">全部</option>');
                for (var i = 0; i < result.data.rows.length; i++) {
                    $('#ityWhiId').append('<option value="' + result.data.rows[i].whiId + '"  >' + result.data.rows[i].whiName + '</option>');//selected="selected"是默认某一个仓库
                }
            }, '')
    }

    /**
     * 有权看钱没权看星
     * */
    function displayMoney(value) {
        if (hasP('purinv:amount:view')) {
            if (value == undefined || value == null) {
                return "--";
            }
            return value;
        } else {
            return '***';
        }
    }

    /**台账*/
    function viewLedger(ityId) {
        loadInfoTable(ityId);
        js.modal.open("modal-view");

    }

    /**库存划项目看*/
    function viewChange(ityId) {
        loadChangeInfoTable(ityId);
        js.modal.open("modal-change-view");
    }


    /**
     *@Description: 加载明细主表
     */
    function loadInfoTable(ityId) {
        /** 加载附件列表 */
        getAnnexList(ityId);
        $("bootstrap-table-view").bootstrapTable('destroy');
        table2 = js.table.init({
            id: 'bootstrap-table-view',
            url: ctx + "pInventoryInfoEdit/findPInventoryMaterielInfoList",
            showColumns: false,
            showExport: false,
            pageSize: 15,
            toolbar: "",
            height: '300',
            queryParams: function (params) {
                var curParams = {
                    // 传递参数查询参数
                    pageSize: params.limit,
                    pageNum: params.offset / params.limit + 1,
                    sort: params.sort,
                    order: params.order,
                    imiItyId: ityId
                };
                return curParams;
            },
            columns: [
                {
                    title: '序号', field: 'imiId', width: '40',
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                },
                {title: '字段名', field: 'imiField'},
                {title: '值', field: 'imiValue'},
                {title: '台账单位', field: 'imiUnit'},
                {title: '物料描述', field: 'ityMatDesc'},
                {title: '数量', field: 'ityNum'},
                {title: '单位', field: 'ityNumUnit'},
            ]
        });
    }

    /**
     *@Description: 加载库存划项目表数据
     */
    function loadChangeInfoTable(ityId) {
        $("bootstrap-change-table-view").bootstrapTable('destroy');
        table4 = js.table.init({
            id: 'bootstrap-change-table-view',
            url: ctx + "purInvQuery/findPInventoryChangeOrderList",
            showColumns: false,
            showExport: false,
            toolbar: "",
            pageSize: 300,
            height: '500',
            queryParams: function (params) {
                var curParams = {
                    // 传递参数查询参数
                    pageSize: params.limit,
                    pageNum: params.offset / params.limit + 1,
                    sort: params.sort,
                    order: params.order,
                    ceoUseItyId: ityId
                };
                return curParams;
            },
            columns: [
                {
                    title: '序号', field: 'ceoUseItyId', width: '40',
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                },
                {title: '需求项目编号', field: 'ceoNeedProCode'},
                {title: '需求项目名称', field: 'ceoNeedProName'},
                {title: '需求物料描述', field: 'ceoNeedMatName'},
                {title: '需求数量', field: 'ceoNeedNum'},
                {title: '挪用项目编号', field: 'ceoUseProCode'},
                {title: '挪用项目名称', field: 'ceoUseProName'},
                {title: '挪用物料描述', field: 'ceoUseMatName'},
                {title: '备注', field: 'ceoRemark'}

            ]
        });
    }

    /** 延迟加载文件列表*/
    function delayLoading(ityId) {
        setTimeout(function () {
            getAnnexList(ityId);
        }, 500);
    }

    /**
     *@FunctionName: getAnnexList
     *@Description: 加载文件列表
     *@DesignIdea: 根据外购件库存表主键加载文件列表
     *@Author: 徐一贺
     *@CreateDate: 2020/5/28 12:41
     *@Phone: 18241927380
     *@Param: [ity] 外购件主键
     *@Version: v1.0.0
     */
    function getAnnexList(ityId) {
        js.post({
            url: ctx + "pInventoryInfoEdit/getAnnexList",
            data: {
                anxItyId: ityId
            },
            success: function (result) {
                $("#recommendtable tbody").html('');
                var tbodyHtml = '';
                var tableData = result.data;
                if (tableData.length > 0) {
                    $("#annex").show();
                } else {
                    $("#annex").hide();
                }
                for (var i = 0; i < tableData.length; i++) {
                    var download = '';
                    var remove = '';
                    if (hasP('purinv:purledgeredit:download')) {
                        download = '<a shiro:haspermission="purinv:purledgeredit:download" onclick="delayLoading(' + tableData[i].anxItyId + ')" href="/pInventoryInfoEdit/download/' + tableData[i].anxId + '" class="btn btn-primary btn-xs"> 下载</a>';
                    }
                    tbodyHtml += ' <tr><td style="vertical-align: middle"><small><p style="line-height: 35px;padding-top:8px;word-wrap: break-word;width: 100%;">' + tableData[i].anxFileName + '</p></small></td>' +
                        '<td style="text-align: center"><small>' + tableData[i].anxFileSize + tableData[i].anxFileSizeUnit + '</small></td>' +
                        '<td style="text-align: center"><small>' + tableData[i].anxDownloadCount + '</small></td>' +
                        '<td style="text-align: center">' + download + remove +
                        '</td></tr>';
                }
                $("#recommendtable tbody").html(tbodyHtml);
            }
        })
    }

    /**
     * 就绪函数
     */
    $(function () {
        $("title").html($("title").html() + " —— 库存划项目库存导出");
        loadWhList();

        // $("#bootstrap-table").hide();
        /**
         * 加载列表
         */
        table = js.table.init({
            url: ctx + "purInvQuery/changeList",
            pageSize: 300,
            showColumns: true,
            showExport: false,
            toolbar: "#toolbar1",
            columns: [
                {
                    title: '序号', field: 'ityId', width: '50',
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                },
                {
                    title: '提报计划物料描述', field: 'ityMatDesc', width: '120', formatter: function (value, row, index) {
                        return '<p  style="word-wrap: break-word;width: 110px">' + value + '</p>';
                    }
                },
                {title: 'SAP<br>物料编码', field: 'itySapCode', width: '90'},
                {title: '数量', field: 'ityNum', width: '50'},
                {title: '单位', field: 'ityNumUnit', width: '50'},//数量单位
                {
                    title: '单价<br>（元）', field: 'ityPrice', formatter: function (value, row, index) {
                        return displayMoney(value);
                    }
                },
                {
                    title: '金额<br>（元）', field: 'ityAmount', formatter: function (value, row, index) {
                        return displayMoney(value);
                    }
                },
                {
                    title: '项目编号', field: 'ityProCode', width: '75', formatter: function (value, row, index) {
                        if (value == undefined || value == null) {
                            value = "--";
                        }
                        return value;
                    }
                },
                {
                    title: '项目名称', field: 'ityProName', width: '100', formatter: function (value, row, index) {
                        if (value == undefined || value == null) {
                            value = "--";
                        }
                        return '<p  style="word-wrap: break-word;width: 90px">' + value + '</p>';
                    }
                },
                {title: '生产状态', field: 'proStatusText', width: '75'},
                {title: '跟踪号', field: 'ityTrackCode', width: '95'},
                {title: '在库类型', field: 'stockType', width: '75'},
                {title: '备注', field: 'ityRemark'},
                {title: '仓库', field: 'whiName'},
                //仓库外键--要显示对应的仓库名字：写数据库语句，建类，写JS（-function...）
                {title: '区位', field: 'ityPosition'},
                {title: '记账日期', field: 'ityBookkeepingDate', width: '100'}
                //     ,
                //     {
                //         title: '操作', width: '80',
                //         formatter: function (value, row, index) {
                //             var actions = [];
                //             if (hasP('purinv:purinvquery:view')) {
                //                 actions.push('<button type="button"  class="btn btn-info btn-xs" onclick="viewChange(' + row.ityId + ')">库存划项目查看</button>');
                //                 actions.push('<button type="button"  class="btn btn-info btn-xs" onclick="viewLedger(' + row.ityId + ')">台账</button>');
                //             }
                //             // if (row.fileCount > 0) {
                //             // }
                //             return actions.join('');
                //         }
                //     }
            ]
        });
        // setTimeout(js.table.search(table),500);
        // $("#bootstrap-table").show();
        // js.table.search(table);
        /**
         * 表格搜索
         */
        $("#btn-search").click(function () {
            js.table.search(table);
        });

        /**
         *@Description: 导出
         */
        $("#btn_exportExcel").click(function () {
            $("#btn_exportExcel").hide();
            $("#btn_tips").show();
            $("#queryForm").submit();
            setTimeout(function () {
                var actionVal = $("#queryForm").attr("action");
                $("#queryForm").removeAttr("action");
                $("#queryForm").attr("action", actionVal);
                $("#btn_tips").hide();
                $("#btn_exportExcel").show()
            }, 20000);
        });
    });
</script>
</body>
</html>